.item
    display: inline-block;
    margin: 10px
    float: left
    width: 134px
    font-size: 0.8em
    &.watched
        opacity: 0.4

        .cover
        &.selected
            opacity 1

    .cover
        position: relative
        background-image url(../images/posterholder.png)
        background-size: 134px 196px
        width: 134px
        height: 196px
        border-radius: $PosterRadius
        box-shadow: $PosterShadow
        cursor: pointer
        
        &.empty
            background-image none

        .cover-overlay
            width 100%
            height 100%
            background-size cover
            background-position center
            position absolute
            transition opacity 500ms ease-in
            opacity 0

            &img
                position absolute
                left 0

            &.fadein
                opacity: 1

            &.cover-info-overlay
              padding 88px 0
              background $PosterHoverOverlay
              border: 2px solid $PosterHoverOverlay
              border-radius $PosterRadius
              transition border-color .25s ease

            .actions-favorites
                float: right
                margin-top: -80px
                margin-right: 7px
                color: #FFFFFF
                font-size: 1.4 em
                -webkit-transition: all 0.5s
                opacity: 0.3

                &.selected
                    color: $FavoriteColor
                    opacity: 1
                &:hover
                    cursor: pointer
                    color: $ButtonBgActive
                    opacity: 1

            .actions-watched
                float: left
                margin-top: -80px
                margin-left: 7px
                color: #FFFFFF
                font-size: 1.4 em
                -webkit-transition: all 0.5s
                opacity: 0.3

                &:hover
                    cursor: pointer
                    color: $ButtonBgActive
                    opacity: 1

                &.selected
                    opacity: 1

            .rating
                background: linear-gradient(to bottom, rgba(206,206,206,0) 0%,rgba(22,22,22,0.69) 69%,rgba(22,22,22,0.95) 100%)
                border-radius $PosterRadius
                bottom 0
                display none
                height auto
                left 0
                margin 0
                overflow hidden
                padding: 10px 5px 5px
                position absolute
                right 0
                text-align left

            .rating-stars
                float left
                margin-top -1px
                font-size 85%

                .rating-star
                    color #ffc900
                    padding-right: 2px
                    vertical-align middle

                .rating-star-half
                    color #ffc900
                    width 50%

                .rating-star-half-empty
                    color #a3a5a7
                    vertical-align middle

                .rating-star-empty
                    color #a3a5a7
                    vertical-align middle

                .rating-star-half-container
                    width 1em
                    height 1em
                    line-height 1em
                    vertical-align middle

            .rating-value
                font-size 1em
                color #fff
                float right

    &.selected
        .cover
            .cover-info-overlay
                border 2px solid $PosterHoverBorder
                transition border-color .50s
                opacity: 1
    .title
        height: auto;
        margin: 6px 0 4px;
        color: $Text1
        max-width: 100%
        overflow: hidden
        text-overflow: ellipsis
        white-space: nowrap
        padding-bottom: 2px

    .year
        font-size: 0.85em
        color: $Text4
        display: inline

    .seasons
        font-size: 0.85em
        color: $Text4
        display: inline
        float: right

        &.quality
            display: none

.load-more
    position relative
    background-size cover
    background-position center center
    width 134px
    height 196px
    border-radius 4px
    box-shadow $PosterShadow
    cursor pointer
    display inline-block
    margin 10px
    float left
    background-color:$BgColor1
    -webkit-transition: background-color 200ms linear;

    > .loading-container
        display none
        margin 0
        position relative
        width 100%
        height 100%

        .ball,
        .ball1
            position absolute
            top 50%
            left 50%
            margin -25px
            -webkit-transform translate(-50%, -50%)
        .ball1
            margin -15px

    .status-loadmore
        position: absolute;
        color: $ButtonText;
        padding: 10px 15px;
        background-color: $ButtonBg;
        -webkit-box-shadow: 0px 0px 6px #000;
        padding-bottom: 10px;
        padding-top: 10px;
        border-radius: 2px;
        font-family: $MainFont, $AlternateFont;
        -webkit-transition: background-color 200ms linear;
        text-align center
        top: 50%
        left: 50%
        width: 90%
        -webkit-transform translate(-50%, -50%)

        &:hover
            background-color:$ButtonBgHover
        &:active
            background-color:$ButtonBgActive

.ghost
    width 134px
    height 0
    margin 10px